<template>
    <MyHead title="订单详细" @click-left="goback"></MyHead>
    <div>
        <div>
            <div v-if="orders.length > 0" class="order-list">
                <div class="order-item">
                    <div class="address">
                        <van-contact-card type="edit" :name="orders[0].name"
                            :tel="orders[0].tel + ' (' + orders[0].province + orders[0].city + orders[0].county + orders[0].addressDetail + ')'"
                            @click="updateAddess" />
                        <div class="time">
                            购买时间: {{ dateFormatInit(orders[0].time * 1) }}
                        </div>
                        <van-card v-for="(v, i) in orders" :key="i" :origin-price="v.originprice"
                            :price="((v.originprice * v.discount) / 10).toFixed(2)" :desc="v.desc" :title="v.proname"
                            class="goods-card" :thumb="v.img1">
                            <template #tags>
                                <van-tag plain type="primary">标签</van-tag>
                            </template>
                            <template #footer>
                                <span>小计 : {{ ((v.originprice * v.discount) / 10 * v.num).toFixed(2) }}</span>
                            </template>
                        </van-card>

                        <div class="time cred">
                            总计: {{ orders.reduce((prev, v) => { return prev + (v.originprice * v.discount) / 10 * v.num },
                                0) }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useCommon } from '../hooks/useCommon'
import { configmOrder } from '../api/order'
import { useRoute } from 'vue-router'
const route = useRoute()
const { goback, dateFormatInit, gotoOnePage } = useCommon()
const orders = ref<any>([])
const userid = localStorage.getItem('id')



onMounted(() => {
    console.log(2)
    configmOrder(userid, route.params.time).then(res => {
        console.log(res)
        if (res.code == '200') {
            orders.value = res.data
        }

    })
})


const updateAddess = () => {
    console.log('12312123')
    gotoOnePage('/address?from=order&time=' + orders.value[0].time)
}
</script>

<style>
.order-list {
    padding: 15px;

}

.order-item {
    margin-top: 15px;
    background: #ddd;
    border-radius: 10px;
    padding: 10px;
}

.time {
    color: #666;
    margin: 10px 0;
    font-size: 14px;
}

.goods-card {
    border-radius: 10px;
}

.cred {
    color: #f50;
}
</style>